<template>
	<view class="">
		
		<view class="content">
			<view class="card-box mt-2" v-for="(item , index) in  agent" :key="index+'agent'">
				<view class="userinfo d-flex align-center">
					<view class="code-box mr-2"><text>商品名称</text></view>
					<view class="font-bold font-20"><text>{{item.in_name}}</text></view>
					
				</view>
				<view class="d-flex align-center mt-2">
					<view class="mr-2 grey">代理佣金：</view>
					<view class="">
						<input type="text" v-model="item.own_money" placeholder="请输入代理佣金" />
					</view>
					<view class="">
						<button size="mini" type="default" @click="submitFY(item)">确定</button>
					</view>
				</view>
				
			</view>
			<page-empty  con="暂无商品~" v-if="isEmpty(agent)"></page-empty>
			
		</view>
	</view>
</template>

<script>
	import UQRCode from 'uqrcodejs';
	import html2canvas from 'html2canvas';
	import tkiQrcode from 'tki-qrcode'
	export default{
		components: {
			tkiQrcode
		},
		data(){
			return{
				keyword:'',
				city: '北京',
				agent:[],
				qrcodeUrl:'',
				shareBg: "https://img2.baidu.com/it/u=3334525604,928778682&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1703955600&t=c88ebba9f3d8aeee92c6afd219945f9a",
				
				agents:[
					{
						username:'Baihii',
						realname:1,//是否实名 1 未 2-已
						exam:1,//是否审核 1 未 2-已
						tel:'1879024524',
						superior:'小刘',//上级
						web:'淘宝',//平台
						addtime:'2024-08-01 15:15',
						allorder:55,
						activation:19,
						monthorder:5,
						monthactive:4
					},
					{
						username:'Baihii',
						realname:1,//是否实名 1 未 2-已
						exam:1,//是否审核 1 未 2-已
						tel:'1879024524',
						superior:'小刘',//上级
						web:'淘宝',//平台
						addtime:'2024-08-01 15:15',
						allorder:55,
						activation:19,
						monthorder:5,
						monthactive:4
					},
					{
						username:'Baihii',
						realname:1,//是否实名 1 未 2-已
						exam:1,//是否审核 1 未 2-已
						tel:'1879024524',
						superior:'小刘',//上级
						web:'淘宝',//平台
						addtime:'2024-08-01 15:15',
						allorder:55,
						activation:19,
						monthorder:5,
						monthactive:4
					},
					{
						username:'Baihii',
						realname:2,//是否实名 1 未 2-已
						exam:2,//是否审核 1 未 2-已
						tel:'1879024524',
						superior:'小张',//上级
						web:'拼多多',//平台
						addtime:'2024-08-01 15:15',
						allorder:55,
						activation:19,
						monthorder:5,
						monthactive:4
					},
				],
				shop_id:0,
			}
		},
		onLoad(options) {
			let aShopId = uni.getStorageSync('shop_id');
			if ((aShopId)) {
				uni.$my.shopId = aShopId;
			}
			this.shop_id = options.shop_id; //当前代理的店铺id
			this.init();
			
			this.qrcodeUrl = uni.$my.currHost+'pages/register/register?invitId=' + uni.$my.shopId;
			// console.log(this.qrcodeUrl,444444444);
			// console.log(uni.$my.shopId,44444444);
		},
		methods:{
			isEmpty(item) {
				return uni.$uv.test.empty(item)
			},
			// 添加代理商
			handAddagent(){
				let that = this;
				uni.showActionSheet({
					itemList: ['生成海报', '复制链接'],
					success: function(res) {
						// console.log(res,44444444);
						// let te = uni.$my.goodsHost + id;
						if(res.tapIndex == 0){
							that.Generateposter();
						}
						if(res.tapIndex == 1){
							that.handAddagentCopy();
						}
						// console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});
			},
			Generateposter() {
				uni.showLoading({
					title: '生成中···'
				})
				// this.rowOne = item;
				
				this.$refs.popupPoster.open('center')
				uni.hideLoading()
			},
			PosterCancel() {
				this.$refs.popupPoster.close()
				
			},
			handAddagentCopy(){
				let test = uni.$my.currHost+'pages/register/register?invitId='+uni.$my.shopId;
				uni.setClipboardData({
					data: test, //需要字符串
					success: function () {
					  uni.showToast({
						title: '已复制链接',
						icon: 'success',
						duration: 2000
					  });
					}
				  });
				// uni.showToast({
				// 	title:'已复制链接'
				// })
			},
			// 筛选
			handScreen(index){
				uni.showToast({
					title:'开发中'
				})
			},
			handTab(item){
				// uni.showToast({
				// 	title:item
				// })
				this.$refs.popupPiliangfy.open('center');
			},
			
			
			init(){
				uni.$uv.http.get('/goods/listCommission?shop_id='+this.shop_id).then(res => {
					console.log(res,999999999);
					this.agent = res.data;
					// this.gridList = this.makeServerPicUrl(res.data.grid || '', 'pic')
					// this.swiperList = this.makeServerPicUrl(res.data.swiper || '', 'pic')
					// this.adList = this.makeServerPicUrl(res.data.ad || '', 'pic')
					// this.tabList = res.data.tab || []
					// this.popAd = this.makeServerPicUrl(res.data.pop || '', 'pic')
					// if (!this.isEmpty(this.popAd) && !this.isReInit) {
					// 	this.openPopAd()
					// }
					// if (!this.isEmpty(this.tabList)) {
					// 	this.getTabData()
					// }
					// console.log(res)
				}).catch(e => {
					console.log(e)
				})
			},
			dumpPage(page, params, type) {
				// console.log(33333333333333);
				uni.$my.dumpPage(page, params, type)
			},
			submitFY(item) {
				let that = this;
				uni.$uv.http.post('/goods/goodsEditMoney',{id:item.id,commission_money:item.commission_money}).then(res => {
					console.log(res);
					// let goodsName = this.products.in_name;
					uni.showToast({
						title:res.msg
					});
					setTimeout(()=>{
						that.$router.go(0);
					},300);
					this.$refs.popupPiliangfy.close();
				})
			},
			
			
		}
	}
</script>

<style lang="scss" scoped>
	.search-box{
		background-color: #F2F2F3;
		border-radius: 36rpx;
		height: 72rpx;
		width: 320rpx;
		padding: 0 0 0 12rpx;
		.search-input-box{
			input{
				width: 280rpx;
			}
		}
		.image100 , .img-box{
			width: 50rpx;
			height: 50rpx;
		}
		.screen-box{
			width: 300rpx;
			.screen-item{
				.text{
					color: #1456FE;
				}
				image{
					width: 40rpx;
					height: 40rpx;
				}
				.shai{
					width: 60rpx;
					height: 60rpx;
				}
			}
		}
		.tab-box{
			width: 100%;
			height: 100rpx;
			background-color: #fff;
		}
		.search-btn{
			width: 128rpx;
			height: 60rpx;
			color: #fff;
			text-align: center;
			line-height: 60rpx;
			background: $uni-color-primary;
			border-radius: 50rpx;
		}
	}
	.content{
		padding: 20rpx;
		padding-bottom: 100rpx;
		.card-box{
			padding: 20rpx;
			width: 100%;
			
			background: #FFFFFF;
			border-radius: 16rpx;
			.code-box{
				color: #fff;
				// width: 100rpx;
				// height: 100rpx;
				// border-radius: 50%;
				text-align: center;
				line-height: 50rpx;
				background-color: $uni-color-primary;
			}
			
			.tag{
				padding: 10rpx 20rpx;
				border-radius: 30rpx;
				font-size: 24rpx;
				.icon{
					width: 30rpx;
					height: 30rpx;
					margin-right: 6rpx;
				}
			}
			.tag1{
				background: #DBE5FF;
				color: #1456FE;
			}
			.tag2{
				background: #FFEAE4;
				color: #FF600F;
			}
			.grey{
				color: #5D5D5D;
			}
			.data-box{
				padding: 20rpx;
				width: 100%;
				
				background: #F1F3F7;
				border-radius: 16rpx;
				.tab_itemorder {
					width: 25%;
					text-align: center;
				}
			}
			.tab-item{
				color: #F79E06;
			}
		}
	}
	.Posterpopup {
		width: 680rpx;
		padding: 10rpx;
		border-radius: 12rpx;
		// background-color: #007aff;
		// background-image: url("../../static/23.png");
		
	
		&-image {
			// width: 600rpx;
			width: 100%;
			height: 900rpx;
			margin: auto;
		}
	
		&-code {
			display: flex;
			justify-content: center;
			margin: 30rpx 0;
		}
	}
	// 批量分佣弹窗
	.Piliangfypopup {
		width: 680rpx;
		padding: 10rpx;
		border-radius: 12rpx;
		background-color: #fff;
	
		.title {
			text-align: center;
			font-weight: 600;
			font-size: 32rpx;
			margin: 16rpx 0;
		}
	
		&-input {
			width: 80%;
			margin: 26rpx auto;
			padding: 8rpx;
			border: 1px solid #999;
			border-radius: 8rpx;
	
			input {
				padding-left: 8rpx;
				width: 100%;
			}
		}
	}
	::v-deep .uni-navbar__header-btns-right{
		display: none;
	}
	::v-deep .uni-navbar__header-btns-left{
		display: none;
	}
	::v-deep .uni-navbar__header-container{
		align-items: center;
	}
</style>